<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
	<title>Internet Dreams</title>
	<!-- Big Button Css -->
	<h:outputStylesheet library="group2" name="css/mybutton.css" />
	<!-- StyleSheet for Datatables Paging -->
	<h:outputStylesheet library="group2" name="css/demo_page.css" />
	<h:outputStylesheet library="group2"
		name="css/jquery.dataTables_themeroller.css" />
	<h:outputStylesheet library="group2"
		name="css/jquery-ui-1.8.4.custom.css" />
	<!-- Stylesheet for paging -->
	<!-- <h:outputStylesheet library="group2" name="css/tablePaging.css" /> -->
	<h:outputStylesheet library="group2" name="css/screen.css" />
	<!--  jquery core -->
	<h:outputScript library="group2" name="js/jquery/jquery-1.4.1.min.js" />
	<!-- jQUERY DataTables -->
	<h:outputScript library="group2" name="js/jquery/jquery.dataTables.js" />
	<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		$('#product-table').dataTable( {
			"bJQueryUI": true,
			"sPaginationType": "full_numbers",
			"aLengthMenu": [[5, 10, 15, -1], [5, 10, 15, "All"]]
		} );
	} );
	</script>
	<!-- Custom jquery scripts -->
	<h:outputScript library="group2" name="js/jquery/custom_jquery.js" />
	<!-- Tooltips -->
	<h:outputScript library="group2" name="js/jquery/jquery.tooltip.js" />
	<h:outputScript library="group2" name="js/jquery/jquery.dimensions.js" />
	<script type="text/javascript">
$(function() {
	$('a.info-tooltip ').tooltip({
		track: true,
		delay: 0,
		fixPNG: true, 
		showURL: false,
		showBody: " - ",
		top: -35,
		left: 5
	});
});
</script>

	<!--  date picker script -->
	<h:outputStylesheet library="group2" name="css/datePicker.css" />
	<h:outputScript library="group2" name="js/jquery/date.js" />
	<h:outputScript library="group2" name="js/jquery/jquery.datePicker.js" />
	<script type="text/javascript" charset="utf-8">
        $(function()
{

// initialise the "Select date" link
$(".datepicker")
	.datePicker(
		// associate the link with a date picker
		{
			createButton:false,
			startDate:'01/01/2005',
			endDate:'31/12/2020'
		}
	).bind(
		// when the link is clicked display the date picker
		'click',
		function()
		{
			updateSelects($(this).dpGetSelected()[0]);
			$(this).dpDisplay();
			return false;
		}
	).bind(
		// when a date is selected update the SELECTs
		'dateSelected',
		function(e, selectedDate, $td, state)
		{
			updateSelects(selectedDate);
		}
	).bind(
		'dpClosed',
		function(e, selected)
		{
			updateSelects(selected[0]);
		}
	);
	
var updateSelects = function (selectedDate)
{
	var selectedDate = new Date(selectedDate);
	$('#d option[value=' + selectedDate.getDate() + ']').attr('selected', 'selected');
	$('#m option[value=' + (selectedDate.getMonth()+1) + ']').attr('selected', 'selected');
	$('#y option[value=' + (selectedDate.getFullYear()) + ']').attr('selected', 'selected');
}
// listen for when the selects are changed and update the picker
$('#d, #m, #y')
	.bind(
		'change',
		function()
		{
			var d = new Date(
						$('#y').val(),
						$('#m').val()-1,
						$('#d').val()
					);
			$('#date-pick').dpSetSelected(d.asString());
		}
	);

// default the position of the selects to today
var today = new Date();
updateSelects(today.getTime());

// and update the datePicker to reflect it...
$('#d').trigger('change');
});
</script>

	<!-- MUST BE THE LAST SCRIPT IN <HEAD></HEAD></HEAD> png fix -->
	<h:outputScript library="group2" name="js/jquery/jquery.pngFix.pack.js" />
	<script type="text/javascript">
$(document).ready(function(){
$(document).pngFix( );
});
</script>
</h:head>

<h:body>

	<!-- Start: page-top-outer -->
	<div id="page-top-outer">
		<!-- insert page top outer hear -->
		<ui:insert name="pagetopouter">
			<ui:include src="include/pageTopOuter.xhtml" />
		</ui:insert>
	</div>
	<!-- End: page-top-outer -->

	<div class="clear">&nbsp;</div>

	<!--  start nav-outer-repeat................................................................................................. START -->
	<div class="nav-outer-repeat">
		<!-- insert nav outer repeat here -->
		<ui:insert name="navouterrepeat">
			<ui:include src="include/navOuterRepeat.xhtml" />
		</ui:insert>
	</div>
	<!--  start nav-outer-repeat................................................... END -->

	<div class="clear"></div>

	<!-- start content-outer -->
	<div id="content-outer">
		<!-- insert content outer here -->
		<ui:insert name="content">
			<ui:include src="include/commonContent.xhtml" />
		</ui:insert>
	</div>
	<!--  end content-outer -->

	<div class="clear">&nbsp;</div>

	<!-- start footer -->
	<div id="footer">
		<!-- insert footer here -->
		<ui:insert name="footer">
			<ui:include src="include/commonFooter.xhtml" />
		</ui:insert>
	</div>
	<!-- end footer -->


</h:body>
</html>